<template>
	<div class="bg-[#EFEFEF]">
		<div class="container mx-auto gap-5 flex flex-col py-5">
			<div class="max-md:px-3">
				{{ lg === 0 ? "Home" : lg === 1 ? "首页" : "首頁" }} >{{ lg === 0 ? "Contact us" : lg === 1 ? "联系我们" : "聯繫我們" }}
			</div>
			<div class="bg-white p-14 max-md:p-3 text-gray-400 gap-5 flex flex-col justify-center items-center overflow-hidden">
				<!-- <span> {{ lg ? "联系我们" : "Contact us" }} </span>
				<span>{{ lg ? "传真" : "fax" }}：{{ $store.state.web_attr.fax }}</span>

				<span>{{ lg ? "电话" : "tel" }}：{{ $store.state.web_attr.tel }} </span>
				<span>{{ lg ? "邮箱" : "email" }}：{{ $store.state.web_attr.email }} </span>
				<span>Q Q：{{ $store.state.web_attr.QQ }} </span>
				<span> {{ lg ? "地址" : "address" }}：{{ $store.state.web_attr.address }}</span>
				<div class="bg-gray-50 aspect-video w-3/5 max-md:w-full">
					<el-amap ref="map" :vid="'amapDemo'" :zoom="zoom" :center="center" class="amap-demo">
						<el-amap-marker v-for="(u, index) in markers" :key="index" :position="u.position"></el-amap-marker>
					</el-amap>
				</div> -->
				<div v-html="content" class="min-h-[40vh]"></div>
			</div>
		</div>
	</div>
</template>

<script>
export default {
	data() {
		return {
			zoom: 12,
			center: [],
			markers: [],
			content: ""
		};
	},
	created() {
		// 113.375489,23.133741
		this.index();
		this.center = [113.375489, 23.133741];
		this.markers = [
			{
				position: [113.375489, 23.133741]
			}
		];
	},

	methods: {
		async index() {
			const [err, res] = await this.$to(this.$axios.get(`&a=getAbout&typeid=${this.$route.query.typeid}`));
			if (err) return this.$message.error(err);
			if (res.code == 0) return this.$message.error(res.msg);

			// this.content = res.data.row.content;

			this.content = res.data.row.content.replace("/public/", "https://admin.fortunajewellery.net/public/");
			function isMobileDevice() {
				return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
			}

			const isMobile = isMobileDevice();

			if (isMobile) {
				this.$nextTick(() => {
					setTimeout(() => {
						var iframe = document.querySelector("iframe");
						iframe.style.width = "385px";
					}, 500);
				});
			} else {
				// 处理非移动端逻辑
				console.log("当前不是移动端");
			}
		}
	}
};
</script>

<style lang="scss" scoped>
.ueditor_baidumap {
	text-align: center !important;
}
// /deep/ .ueditor_baidumap,
// .BMap_mask {
// 	// width: 300px !important;
// }
</style>
